// base color
$blue: #324157;
$light-blue: #3A71A8;
$red: #C03639;
$pink: #E65D6E;
$green: #30B08F;
$tiffany: #4AB7BD;
$yellow: #FEC171;
$panGreen: #30B08F;

$--color-main: #1890ff;
$--color-primary: #1890ff;
$--color-success: #2cbc74;
$--color-warning: #d69641;
$--color-danger: #d14e60;
// $--color-info: #1E1E1E;

// sidebar
$menuText: #bfcbd9;
$menuActiveText: $--color-primary;
$subMenuActiveText: $--color-primary; // https://github.com/ElemeFE/element/issues/12951

$menuBg: #304156;
$menuHover: #263445;

$subMenuBg: #1f2d3d;
$subMenuHover: #001528;

$sideBarWidth: 240px;
//
///***/
//$--button-font-weight: 400;
//
//// $--color-text-regular: #1f2d3d;
//
//$--border-color-light: #dfe4ed;
//$--border-color-lighter: #e6ebf5;
//
//$--table-border: 1px solid #dfe6ec;
//
//$--color-text-regular: #333 !default;
//$--input-placeholder-color: #999 !default;
//$--input-disabled-fill: rgba(255, 0, 0, 0.5) !default;
//$--input-disabled-color: #fff !default;
//
//$--dialog-padding-primary: 15px !default;
//
//$dialog-header-background: #304156;
//
////left-tree-sidebar
//$left-tree-sidebar-current-background: $--color-primary;
//$left-tree-sidebar-hover-background: rgba(0, 0, 0, 0.5) !default;
//
///**------------*/
//$--color--background: #0B111A;
//$--color--background--hover: #001528;
//$--color--border: #304156;
//$--border-width-base: 1px !default;
//$--border-style-base: solid !default;
//$--border-base: $--border-width-base $--border-style-base $--color--border !default;
//
///// color|1|Background Color|4
$--color-white: #FFFFFF !default;
//
//
///* Card
//--------------------------*/
///// color||Color|0
//$--card-border-color: $--color--border !default;
//$--card-border-radius: 4px !default;
///// padding||Spacing|3
//$--card-padding: 20px !default;
//
///* Input
//-------------------------- */
//$--input-font-color: $--color-white !default;
//$--input-background-color: $--color--background !default;
//$--input-border: $--border-base !default;
//$--select-option-color: $--color-white !default;
//$--select-option-hover-background: $--color--background--hover !default;
//
///* Select
//-------------------------- */
//$--select-dropdown-background: $--color--background !default;
//$--select-dropdown-border: solid 1px $--color--border !default;
//
///* Popover
//-------------------------- */
//$--popover-border-color: $--color--border !default;
//$--popover-background-color: $--color--background !default;
//$--popover-title-font-color: $--color-white !default;

/* Table
-------------------------- */
$--table-border-color: #216892 !default;
$--table-border: 1px solid $--table-border-color !default;
$--table-font-color: $--color-white !default;
$--table-header-font-color: $--color-white !default;
$--table-row-hover-background-color: rgba(255, 255, 255, 0.2) !default;
$--table-current-row-background-color: rgba(255, 255, 255, 0.2) !default;
$--table-header-background-color: transparent !default;
$--table-fixed-box-shadow: 0 0 10px rgba(255, 255, 255, 0.5) !default;

/* Cascader
-------------------------- */
/// color||Color|0
//$--cascader-menu-font-color: $--color-white !default;
/// color||Color|0
//$--cascader-menu-selected-font-color: $--color-primary !default;
//$--cascader-menu-fill: $--color--background !default;
//$--cascader-menu-border: solid 1px $--color--border !default;
//$--cascader-menu-shadow: $--box-shadow-light !default;
//$--cascader-node-background-hover: $--color--background--hover !default;

/* Dropdown
-------------------------- */
//$--dropdown-menuItem-hover-fill: $--color--background--hover !default;
//$--dropdown-menuItem-hover-color: $--color-white !default;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
}